page{
  /* 
    把页面信息给撑上去，撑上去的高度为90rpx，
    和底部固定位置的btm_tool样式高度保持一致
   */
  padding-bottom: 90rpx;
}

.detail_swiper{
    swiper{
      /* 因为原图是400*400，高度和宽度相同  (width:100% 等价于 width:100vw) */
      height: 65vw;
      /* background-color: red; */
      text-align: center;
      image{
        width: 60%;
      }
    }
  }

.goods_price{
  padding: 15rpx;
  font-size: 32rpx;
  /* font-weight: 600 加粗 */
  font-weight: 600;
  color: var(--themeColor);
}
.goods_name_row{
  border-top: 5rpx solid #dedede;
  border-bottom: 5rpx solid #dedede;
  padding: 10rpx 0;
  display: flex;
  .goods_name{
    /* 占伸缩盒子的5/6份 */
    flex: 5;
    color: #000;
    font-size: 30rpx;
    padding: 0 10rpx;

    /* 多行显示的css样式 */
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    /* 限制块级标签显示的文本行数 */
    -webkit-line-clamp:2;

     /* 让英文产生换行效果 */
     word-wrap: break-word;
     word-break: break-all;
      /* 让英文产生换行效果 */
  }
  .goods_collect{
    /* 占伸缩盒子的1/6份 */
    flex: 1;
    display: flex;
    /* 改变主轴方向为上下方向 */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-left: 1rpx solid #000;
    .iconfont{

    }
    .icon-shoucang1{
      color: orangered;
    }
    .collect_text{

    }
  }
}

.goods_info{
  .goods_info_title{
    font-size: 32rpx;
    color: var(--themeColor);
    /* 加粗 */
    font-weight: 600;
    padding: 20rpx;
  }
  .goods_info_content{}
}


.btm_tool{
  border-top: 1rpx solid #ccc;
  /* 固定位置 */
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 90rpx;
  background-color: #fff;
  display: flex;
  
  .tool_item{
    flex: 1;
    display: flex;
    /* 改变主轴方向为上下方向 */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 24rpx;
    /* 相对位置：父 */
    position: relative;
    button{
      /* 绝对位置：子 */
      /* 子在父中进行自由定位 */
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      /* 将透明度调为0 */
      opacity: 0;
    }
  }
  .btn_cart{
    flex: 2;
    display: flex;
    /* 改变主轴方向为上下方向 */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #ffa500;
    color: #fff;
    font-size: 30rpx;
    font-weight: 600;
  }
  .btn_buy{
    flex: 2;
    display: flex;
    /* 改变主轴方向为上下方向 */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #eb4450;
    color: #fff;
    font-size: 30rpx;
    font-weight: 600;
  }
}